<template>
  <div>
    <SignetCanvas
      :id="props.id"
      v-bind="{
        ...props.data,
        ...props.style,
        displayWidth: props.style.width,
        displayHeight: props.style.height
      }"
      v-model:src="data.src"
    >
    </SignetCanvas>
  </div>
</template>

<script setup lang="ts">
import SignetCanvas from '@/components/SignetCanvas/index.vue'
import type { IDiyBase } from '@/diy/types'
import { useVModel } from '@vueuse/core'

const props = defineProps<IDiyBase>()

const emit = defineEmits(['update:data'])
const data = useVModel(props, 'data', emit)
</script>

<style scoped></style>
